/**
 * Created with Vim7.3 ubuntu12.04
 * @fileOverview : 
 * @author : Lyle
 * @since : 2015-03-16 13:54:08
 * @filename : public/js/payment.js
 * @version : 
 * @description : 
 */

var userInfo = {
        country : 36, 
        state : 6911
    };

var pay,failed,success,
    apiUrl = '/apis/';

pay = {

    start : function() {
       this.show(); 
       this.bindEvt();
       this.getAjaxCountry();           
    },

    show : function() {
       $('.page').css('display','none');
       $('#ccPayment').css('display','block');
    },

    bindEvt : function() {
 
       var tthis = this;

       $('#ccPayment').find('input[name="card_number"]').on('input',function(e) {
            var value=$(this).val().replace(/\s/g,'').replace(/(\d{4})(?=\d)/g,"$1 ");  
            $(this).val(value)
       });

       $('#ccPayment').find('select[name="country"]').on('change',function(e) {
            var val = $(this).find('option:selected').attr('val'); 
            if (val && val !== '') {
                tthis.changeCountry(val);
            }
       });

       $('#ccPayment').find('input[name="expiration_date"]').on('focus',function(e){
            var val = $(this).val();
            if (val == '') {
                $(this).attr('placeholder','YY/MM');
            } 
       });

       $('#ccPayment').find('input[name="expiration_date"]').on('input',function(e) {
            var value = $(this).val().replace(/\//g,'').replace(/(\w{2})(?=\w)/g,"$1/");
            $(this).val(value);
       });

       $('#ccPayment').find('.submit').on('tap',function(){
            console.log('submit');
            var obj = tthis.checkCC();
            if (obj) {
                //ttthis.getAjaxCC(obj);
            }
       })

       $('#ccPayment').find('input[name="card_number"]').on('change',function(){
            var cardNum = $(this).val().replace(/\s/g,'');
            var type = common.checkCard(cardNum);  
            if (type) {
                $('#ccPayment').find('.card').find('.'+type).removeClass('hide_card');
            } else {
                $(this).parent().css('border','1px solid #f00');
                common.openTopError({dom:$('#ccPayment').find('.topTip'),type:'error',text:'Oops!It looks like some information is missing or incorrect.',time:3000}); 
            }
       });
    },

    checkCC : function() {
       var obj = {}, bool = true;

       $('#ccPayment').find('input').each(function(){
           var val = $(this).val();
           if (val == '') {
               $(this).parent().css('border','1px solid #f00');
               bool = false; 
           } else {
               $(this).parent().css('border','1px solid #ccc');
           }
       });

       if (bool) {
           obj.country = $('#ccPayment').find('select[name="country"]').find('option:selected').attr('val');
           obj.state_id = $('#ccPayment').find('select[name="state_id"]').find('option:selected').attr('val');
           obj.city = $('#ccPayment').find('input[name="city"]').val();
           obj.street = $('#ccPayment').find('input[name="street"]').val();
           obj.zip = $('#ccPayment').find('input[name="zip"]').val();
           obj.phone = $('#ccPayment').find('input[name="phone"]').val();
           obj.credit_card_name = $('#ccPayment').find('input[name="credit_card_name"]').val();
           obj.cc_verification = $('#ccPayment').find('input[name="cc_verification"]').val();
           //....
           return obj;
       } else { 
           common.openTopError({dom:$('#ccPayment').find('.topTip'),type:'error',text:'Oops!It looks like some information is missing or incorrect.',time:3000}); 
           return bool;
       }
    },

    getAjaxCountry : function() {
        var tthis = this;
        var obj = {
            url :  apiUrl+'get_country_list',
            data : '',
            type : 'POST',
            success : function(data){
                 if (data.results) {
                     common.Loading($('body'),false);
                     tthis.domCountry(data.data,userInfo.country);
                 } else {
                     common.openTopError('Get country list is error.'); 
                 }
            }, 
            error : function() {}
        };
        common.Loading($('body'),true);
        common.ajax(obj);
    },
    
    domCountry : function(data,selectId) {
        var html = this.domForOption(data,selectId);
        $('#ccPayment').find('.body').find('select[name="country"]').html(html);
    },

    changeCountry : function(cId) {
        this.getAjaxState(cId);
    },

    getAjaxState : function(cId) {
        var tthis = this;
        var obj = {
            url :  apiUrl+'get_state_list',
            data : {country:cId},
            type : 'POST',
            success : function(data){
                 if (data.results) {
                     tthis.domState(data.data,userInfo.state);
                 } else {
                     common.openTopError({dom:$('body').find('.topTip'),type:'error',text:'Get state list is error.'}); 
                 }
            }, 
            error : function() {}
        };
        common.ajax(obj);
    },

    domState : function(data,selectId) {
        var html = this.domForOption(data,selectId);
        $('#ccPayment').find('.body').find('select[name="state_id"]').html(html);
    },

    domForOption : function(data,selectId) {
        var html = '';
        for (var i in data) {
           if (parseInt(data[i].value) == parseInt(userInfo.country)) {
               html+='<option val="'+data[i].value+'" selected>'+data[i].label+'</option>';
               this.changeCountry(parseInt(data[i].value));
           } else if (data[i].value !== '') { 
               html+='<option val="'+data[i].value+'">'+data[i].label+'</option>';
           } else {
               html+='<option val="'+data[i].value+'" disabled>'+data[i].label+'</option>';
           }
        }
        return html;
    },

    getPostPayment : function(obj) {
        var tthis = this;
        var obj = {
            url :  apiUrl+'',
            type : 'GET',
            success : function(data){
                 console.log(data);
                 if (data.error) {
                     //success.show(data);
                 } else {
                     //fail.show(data);
                 }
            }, 
            error : function() {}
        };
        common.ajax(obj);
    },
};


fail = {

     start : function() { 
        this.show();
        this.bindEvt();
     },

     show : function(data) {
        $('.page').css('display','none');
        $('#ccFail').css('display','block');
        this.setDataDom();
     },

     bindEvt : function() {

        $('#ccFail').find('.back').on('tap',function(){
             pay.show();
        });
       
        $('#ccFail').find('.paypal_icon').on('tap',function(){
             alert('paypal');
        });
     },

     setDataDom : function() {

     },
};

success = {
     
     start : function() { 
        this.show();
        this.bindEvt();
     },

     show : function(data) {
        $('.page').css('display','none');
        $('#ccSuccess').css('display','block');
     },

     bindEvt : function() {

        $('#ccSuccess').find('.done').on('tap',function(){
             alert('done');
        })
     
     },

};

$(document).ready(function(){
    pay.start();
    fail.start();
    success.start();
    fail.show();
});




